<template>
<div>
  <!-- 
    v-show和if
    作用：控制标签显示隐藏
    区别：
      v-if： 直接把标签从DOM结构中删除来实现隐藏
      v-show：通过样式display:none来实现隐藏
   -->
  <h1 v-show="bool">v-show的盒子</h1>
  <h1 v-if="bool">v-if的盒子</h1>
  <!-- 
    高级用法：v-if可以结合v-else一起使用
   -->
   <div>
    <h2 v-if="user.age>=18">成年人</h2>
    <h2 v-else>未成年</h2>
   </div>
</div>
</template>
<script>
export default {
  data(){
    return {
      bool: false,
      user: {
        age: 16
      }
    }
  }
}
</script>
<style scoped>
</style>